<template>
  <el-table v-loading="loading" :data="list" class="workflow-list" :row-class-name="rowClass">
    <el-table-column type="index" width="55" align="center" label="序号" />
    <el-table-column label="任务" align="center" prop="taskName" />
    <el-table-column label="归属企业" align="center" prop="deptName" />
    <el-table-column label="任务类型" align="center" prop="taskStatus">
      <template v-slot="{ row }">
        <div>{{ formatTaskStatus(row) }}</div>
      </template>
    </el-table-column>
    <el-table-column label="任务状态" align="center" prop="status">
      <template v-slot="{ row }">
        <div>{{ formatStatus(row) }}</div>
        <div>{{ formatReason(row) }}</div>
      </template>
    </el-table-column>

    <el-table-column label="任务执行人" align="center" prop="doUser" />
    <el-table-column label="时间" align="center" prop="startTime" width="180">
      <template slot-scope="scope">
        <div>{{ scope.row.startTime }}</div>
        <div>{{ formatTime(scope.row) }}</div>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import '@/assets/styles/workflow.scss'

import { formatTaskStatus, formatStatus, formatReason, formatTime, getStep } from '@/utils/workflow'

export default {
  name: 'TaskHistotyList',

  props: {
    taskId: { type: String, required: true },
    list: { type: Array },
  },

  data() {
    return {
      data: [],

      loading: false,
      total: 0,
    }
  },

  methods: {
    rowClass({ row }) {
      if (row.status === 3) {
        return ['finish', 'reject'][row.reason - 1]
      }
      return ['waiting', 'doing', 'revoke'][row.status]
    },

    /**
     * 格式化
     */
    formatTaskStatus,
    formatStatus,
    formatReason,
    formatTime,
    isCheck(status) {
      return getStep(status) > 2
    },
  },
}
</script>
